
<template>
	<div class="index">

		<div class="center">
			<left></left>
			<div class="right">
          <top></top>
          <div class="hei10"></div>
          <div class="where" style="background: #fff; padding: 10px 30px; font-size: 14px; color: #595959;">
            当前位置：
            <router-link to="/index" style="color: #409eff;">分销后台</router-link>>
            <router-link v-if="this.$route.query.tab==1||this.$route.query.tab==2||this.$route.query.tab==3||this.$route.query.tab==4"
			:to="{path:'/tousugongdan',query:{tab:this.$route.query.tab}}" style="color: #409eff;"  >投诉工单管理</router-link>
			<router-link v-if="this.$route.query.tab==5"
			:to="{path:'/order_question'}" style="color: #409eff;"  >我的订单</router-link>
			<router-link v-if="this.$route.query.tab==6"
			:to="{path:'/order_question/orderOther'}" style="color: #409eff;"  >分销商发展订单</router-link>
			<router-link v-if="this.$route.query.tab==7"
			:to="{path:'/order_question/old_dingdan'}" style="color: #409eff;"  >历史订单查询</router-link>
			<router-link v-if="this.$route.query.tab==8"
			:to="{path:'/order_question/old_Other'}" style="color: #409eff;"  >分销商发展历史订单</router-link>
			>详情

          </div>
		  <div class="hei10"></div>
		  <div class="con t_outbox">

			<div class="t_order_detail" style="position: relative;">
				<img v-if="choosedetail.status==3" src="../../static/img/clbh.png" class="t_clbh" alt="">
				<el-button @click="allcopy" class="t_all_ts" type="primary" size="small" plain>一键复制投诉信息</el-button>
				<div style="display: flex;padding-left: 50px;box-sizing: border-box;">
					<div
					class="t_order_title"
					:class="{t_order_title_lei:(item.id==chooseorderid)&&(detaillist.length>1)}"
					style="color: #5C5C5C;"
					@click="changeorder(item.id)"
					v-for="(item,index) in detaillist" :key="index">工单编号：{{ item.id }}</div>
				</div>

				<div class="t_detail_kj" style="margin-left: 50px;color:#9F9F9F">
					<div>创建时间：{{ choosedetail.created_at }}</div>
					<div style="margin-left: 50px;">截止时间：{{ choosedetail.overdue_at }}</div>
				</div>
				<div class="t_detail_kj" style="margin-left: 50px;color: #5D5D5D;">
					<div><span style="color: #333333;">投诉来源：</span>
						<span v-if="choosedetail.source==1">运营商投诉</span>
						<span v-if="choosedetail.source==2">工商局投诉</span>
						<span v-if="choosedetail.source==3">平台工单投诉</span>
						<span v-if="choosedetail.source==4">电话投诉</span>
						<span v-if="choosedetail.source==5">其他投诉</span>

					</div>
					<div style="margin-left: 50px;">
						<span style="color: #333333;">优先级：</span>
						<span v-if="choosedetail.priority==3" style="color: #FF0000;">最高</span>
						<span v-if="choosedetail.priority==2" style="color: #F600CB;">较高</span>
						<span v-if="choosedetail.priority==1" style="color: #FFA700;">普通</span>
						<span  v-if="choosedetail.priority==0" >较低</span>

					</div>
					<div style="margin-left: 50px;color: #5D5D5D;">
						<span style="color: #333333;">当前状态：</span>
						<span v-if="choosedetail.status==0">待处理</span>
						<span v-if="choosedetail.status==1">处理中</span>
						<span v-if="choosedetail.status==2">处理完成</span>
						<span v-if="choosedetail.status==3">处理中</span>
					</div>
					<div style="margin-left: 50px;">当前处理人：{{ choosedetail.handler }}</div>
				</div>
				<div class="t_detail_kj">
					<div class="t_deta_title">用户投诉内容：</div>
					<div class="t_deta_con">{{ choosedetail.content }}</div>
				</div>
				<div class="t_detail_kj" v-for="(item,index) in choosedetail.restart_reason" :key="index">
					<div class="t_deta_title">重启投诉原因{{index+1}}：</div>
					<div class="t_deta_con">{{ item }}</div>
				</div>
				<div class="t_detail_kj">
					<div class="t_deta_title">处理意见：</div>
					<div class="t_deta_con">{{ choosedetail.requirement }}</div>
				</div>
				<div class="t_detail_kj">
					<div class="t_deta_title">订单信息：</div>
					<div class="t_deta_con">
						<div class="t_order_box">
							<div class="t_order_box_detail t_order_box_detail_head">
								<div>订单ID：{{ choosedetail.order_id }}<i class="el-icon-document-copy"
											style="color: #077ECE; font-size: 16px; margin-left: 10px; cursor: pointer;" @click="copy(choosedetail.order_id)"></i>
								</div>
								<div>订单来源：{{ choosedetail.order_source }}</div>
								<div>外部订单编号：{{ choosedetail.source_id }}<i class="el-icon-document-copy"
											style="color: #077ECE; font-size: 16px; margin-left: 10px; cursor: pointer;" @click="copy(choosedetail.source_id)"></i>
								</div>
								<div>平台创建时间：{{ choosedetail.order_created_at }}</div>
							</div>
							<div class="t_order_box_detail">
								<div class="t_detail_right">商品名称：{{ choosedetail.product_sku }}</div>
								<div class="t_detail_right">商品编码：{{ choosedetail.source_sku }}</div>
								<div class="t_detail_right">购买号码：{{ choosedetail.plan_mobile }}</div>
								<div>生产号码：{{ choosedetail.plan_mobile_produced }}</div>
							</div>
							<div class="t_order_box_detail" style="display: block;">
								<div style="display: flex;">
									<div class="t_detail_right">证件姓名：{{ choosedetail.id_card_name }}</div>
									<div class="t_detail_right">收件人：{{ choosedetail.address_name }}</div>
									<div>证件号码：{{ choosedetail.id_card_num }}</div>
								</div>
								<div style="display: flex;margin-top: 20px;">
									<div class="t_detail_right">联系电话：{{ choosedetail.address_mobile }}</div>
									<div class="t_detail_right">收货地址：{{ choosedetail.address_province }}{{ choosedetail.address_city }}{{ choosedetail.address_district }}{{ choosedetail.address }}</div>
									<el-button type="text" @click="fullmsg(choosedetail.order_id)">查看完整信息</el-button>
								</div>
							</div>
							<div class="t_order_box_detail">
								<div class="t_detail_right">订单状态：{{ choosedetail.order_status }}</div>
								<div class="t_detail_right">激活状态：{{ choosedetail.active_status }}</div>
								<div>退款状态：{{ choosedetail.refund_status }}</div>
							</div>
							<div class="t_order_box_detail">
								<div class="t_detail_right">物流公司：{{ choosedetail.tracking_company }}</div>
								<div>物流单号：{{ choosedetail.tracking_number }}</div>
							</div>
						</div>
					</div>
				</div>
        <div class="t_detail_kj" v-if="shop_id == 304676 || shop_id == 50481">
        	<div class="t_deta_title">拨打电话：</div>
        	<div class="t_deta_con">
            <dadianhua v-if="choosedetail.call_logs" :call_logs="choosedetail.call_logs" :order_id="choosedetail.order_id" :job_id="$route.query.id"></dadianhua>
        	</div>
        </div>
				<div class="t_detail_kj" >
					<div class="t_deta_title">投诉结果：</div>
					<div class="t_deta_con"  >

						<div v-if="showresult"
						style="margin-top: -10px;" class="t_bj_box" >

						<div>
							<div style="display: flex;">
								<div style="font-weight: bold;margin-right:20px">{{ tstotext(choosedetail.class_id) }}</div>
								<div style="font-weight: bold;margin-bottom: 10px;" v-if="choosedetail.result_type==1">满意</div>
								<div style="font-weight: bold;margin-bottom: 10px;" v-if="choosedetail.result_type==2">不满意</div>
								<div style="font-weight: bold;margin-bottom: 10px;" v-if="choosedetail.result_type==3">未成功取得联系</div>
								<div style="font-weight: bold;margin-left:20px">{{ cltotext(choosedetail.handle_type) }}</div>
							</div>

							<span v-if="choosedetail.result!=''">{{ choosedetail.result }}</span>
							<span v-else></span>
						</div>

						<div>
							<el-button
							@click="copy2"
							type="text" style="margin-left: 30px;">复制</el-button>
							<el-button  type="text" @click="czresult(3)" >编辑</el-button>
						</div>

						</div>
						<div v-else>
							<el-select v-model="choosevalue" size="small" placeholder="请选择" style="margin-bottom: 10px;">
								<el-option
								v-for="item in options"
								:key="item.value"
								:label="item.label"
								:value="item.value">
								</el-option>
							</el-select>
							<span style="margin-left: 30px;">投诉内容分类：</span>
							<el-select v-model="choosetsvalue" size="small" placeholder="请选择" style="margin-bottom: 10px;">
								<el-option
								v-for="item in tslist"
								:key="item.id"
								:label="item.title"
								:value="item.id">
								</el-option>
							</el-select>
							<i @click="changetstype" style="cursor: pointer;" class="el-icon-edit"></i>
							<el-select v-model="chooseclvalue" size="small" placeholder="请处理方式" style="margin-bottom: 10px;margin-left: 30px;">
								<el-option
								v-for="(item,index) in chulilist"
								:key="index"
								:label="item.name"
								:value="item.id">
								</el-option>

							</el-select>
							<i @click="changecltype" style="cursor: pointer;" class="el-icon-edit"></i>
							<el-input type="textarea"  :rows="8" resize='none'
							v-model="inputresult"
							placeholder="请输入处理结果"   ></el-input>
							<div style="text-align: right;
							margin-top: 10px;">

								<el-button size="small"
								@click="czresult(1)"
								type="text" style="margin-left: 30px;">取消</el-button>
								<el-button size="small"
								@click="czresult(2)"
								type="primary" style="margin-left: 30px;">保存</el-button>
							</div>
						</div>
					</div>
				</div>
				<div class="t_detail_kj" style="align-items: center;">
					<div class="t_deta_title">赔付金额：</div>
					<div class="t_deta_con">
						<div v-if="showmoney" class="t_bj_box">
							{{ choosedetail.compensation_amount }}<el-button @click="czmoney(3)" type="text"  >编辑</el-button>
						</div>
						<div v-else>
							<el-input v-model="inputmoney"
							type="number"  style="width:200px" placeholder="请输入赔付金额"></el-input>
							<el-button size="small"
							@click="czmoney(1)"
							type="text" style="margin-left: 30px;">取消</el-button>
							<el-button size="small"
							@click="czmoney(2)"
							 type="primary" style="margin-left: 30px;">保存</el-button>
						</div>
					</div>
				</div>
				<div class="t_detail_kj">
					<div class="t_deta_title">上传附件：</div>
					<div class="t_deta_con" style="display: flex;width: 0;flex-wrap: wrap;">
						<el-tag
						style="margin-right: 10px;cursor: pointer;background-color: white;margin-bottom: 10px;"
						v-for="tag in files"
						:key="tag.id"
						@close="removetag(tag)"
						@click="taglink(tag)"
						closable>
						{{tag.file_name}}
						</el-tag>
						<el-upload
						v-if="files.length<5"
						action="#"
						:on-change="uploadok"
						:show-file-list="false"
						:auto-upload="false"
						:multiple="false"
						>
							<el-button  size="small" plain round type="primary">点击上传</el-button>
						</el-upload>
						<div v-if="files.length==5">
							<el-button @click="overnum" style="padding: 8px 15px !important;"  size="mini"  plain round type="primary">点击上传</el-button>
						</div>

					</div>
				</div>
				<div style="text-align: center;margin-top: 50px;">
					<el-button @click="backlist(1)" v-if="choosedetail.status!=2" type="primary" plain round>处理完成</el-button>
					<el-button @click="backlist(3)" v-else type="primary" plain round>重启投诉</el-button>
					<el-button @click="backlist(2)" style="margin-left: 50px;" type="primary" plain round>关闭</el-button>
				</div>
			</div>
			<div class="t_talk_box">
				<div class="t_cllc_title">处理流程</div>
				<div class="t_lc_box">
					<div class="t_lc_item" v-for="(item,index) in speaklist" :key="index">
						<div style="color: #9f9f9f;font-size: 14px;">{{ item.created_at }}</div>
						<div style="font-size: 14px;" v-if="item.type==0" class="t_speak_red" v-html="item.content"></div>
						<div style="color: #333333;font-size: 14px;" v-if="item.type==1" v-html="item.content"  ></div>
					</div>

				</div>
				<el-input type="textarea" v-model="sendmsg" :rows="8" resize='none' placeholder="请输入留言内容按Ctrl+Enter发送" @keydown.ctrl.enter.native="send()"  ></el-input>
			</div>
		  </div>
		</div>
	</div>
	<!-- 重启投诉 -->
	<el-dialog
		title="请输入重启原因"
		:visible.sync="isshowreplace"
		:center="true"
		class="t_cq_form"
		width="500px">
		<el-form >
			<el-form-item :required='true' label="重启原因" >
				<el-input style="width: 370px;" v-model="replaceres" ></el-input>
			</el-form-item>
		</el-form>
		<span slot="footer" class="dialog-footer">
			<el-button type="danger" round @click="surereplace">确认重启</el-button>
		</span>
	</el-dialog>
	<!-- 投诉分类 -->
	<el-dialog
		title="投诉分类"
		:visible.sync="isshowtstype"
		width="400px"
		:close-on-click-modal="false">
		<div style="margin-bottom: 10px;" v-for="(item,index) in tslist" :key="index">{{ item.title }} <i @click="deltstype(item)" style="cursor: pointer;margin-left: 10px;" class="el-icon-delete"></i></div>
		<el-input style="margin-top: 20px;" size="small" v-model="tstitle" placeholder="添加分类"></el-input>
		<span slot="footer" class="dialog-footer">
			<el-button size="small" @click="isshowtstype = false">取 消</el-button>
			<el-button size="small" type="primary" @click="sureaddtype">确 定</el-button>
		</span>
	</el-dialog>
	<!-- 处理分类 -->
	<el-dialog
		title="处理分类"
		:visible.sync="isshowcltype"
		width="400px"
		:close-on-click-modal="false">
		<div style="margin-bottom: 10px;" v-for="(item,index) in chulilist" :key="index">{{ item.name }} <i @click="delcltype(item)" style="cursor: pointer;margin-left: 10px;" class="el-icon-delete"></i></div>
		<el-input style="margin-top: 20px;" size="small" v-model="cltitle" placeholder="添加分类"></el-input>
		<span slot="footer" class="dialog-footer">
			<el-button size="small" @click="isshowcltype = false">取 消</el-button>
			<el-button size="small" type="primary" @click="sureaddcltype">确 定</el-button>
		</span>
	</el-dialog>
	</div>
</template>

<script>
	import axios from 'axios'
	import top from '@/components/top.vue'
	import left from '@/components/left.vue'
	import foot from '@/components/foot.vue'
  import dadianhua from './tousugongdan/dadianhua.vue'

	export default {
		components: {
			"left": left,
			"top": top,
			"foot": foot,
      dadianhua
		},
		name: 'productionBasismanagDj',
		data() {
			return{

				checkid:'',
				speaklist:[],
				sendmsg:'',
				//所有工单
				detaillist:[],
				//当前工单
				choosedetail:{},
				//当前工单id
				chooseorderid:'',
				//是否展示处理结果文字
				showresult:true,
				//是否展示赔付金额
				showmoney:true,
				//输入处理结果
				inputresult:'',
				//输入金额
				inputmoney:'',
				//文件
				files: [],
				//重启弹窗
				isshowreplace:false,
				//重启原因
				replaceres:'',
        		shop_id:"",
				options: [{
					value: 1,
					label: '满意'
					},
					{
					value: 2,
					label: '不满意'
					},
					{
					value: 3,
					label: '未成功取得联系'
					},
				],
				choosevalue:'',
				tslist:[],
				isshowtstype:false,
				isshowcltype:false,
				tstitle:'',
				cltitle:'',
				choosetsvalue:'',
				chooseclvalue:'',
				chulilist:[]
			}
		},
		created() {

			this.checkid = this.$route.query.id
			//获取左侧详情
			this.getdetail()
			//右侧留言列表
			this.getspeak(this.$route.query.id)
			//文件列表
			this.getfilelist(this.$route.query.id)
			//获取投诉分类
			this.gettslist()
			//获取处理分类
			this.getcllist()

      axios.get('/api/gth/user/shop')
        .then(response => {
            if(response.data.msg.code == 0){
                this.shop_id = response.data.data.shop_id
            }else{
                this.$message.error(response.data.msg.info);
            }
        })
		},

		methods: {
			//右侧留言列表
			getspeak(id){
				axios.post('/api/plan-market/admin/complaint/job/comment/list',{
					id:id
				})
				.then(response => {
					if (response.data.msg.code == 0) {
						console.log('右侧留言')
						console.log(response)
						this.speaklist = response.data.data
					} else {
						this.$message.error(response.data.msg.info);
					}
				})
			},
			//获取左侧详情
			getdetail(){
				axios.post('/api/plan-market/admin/complaint/job/info',{
					id:this.checkid
				})
				.then(response => {
					if (response.data.msg.code == 0) {
						console.log('左侧详情')
						console.log(response)
						this.detaillist = response.data.data
						//从几号进，当前就是几号
						for(var x = 0;x<this.detaillist.length;x++){
							if(this.detaillist[x].id==this.checkid){
								this.choosedetail = this.detaillist[x]
								this.chooseorderid = this.detaillist[x].id
							}
						}


					} else {
						this.$message.error(response.data.msg.info);
					}
				})
			},
			//切换订单
			changeorder(id){
				this.chooseorderid = id
				//右侧留言列表
				this.getspeak(id)
				//文件列表
				this.getfilelist(id)
				for(var x = 0;x<this.detaillist.length;x++){
					if(this.detaillist[x].id == id){
						this.choosedetail = this.detaillist[x]
					}
				}
			},
			//操作处理结果
			czresult(type){
				if(type==1){
					//取消
					this.showresult = true
				}else if(type==2){
					// if(this.inputresult==''||this.choosevalue==''||this.choosetsvalue==''){
					// 	this.$message.error('内容未填写完整');
					// 	return
					// }
					//保存
					axios.post('/api/plan-market/admin/complaint/job/result',{
						id:this.chooseorderid,
						result:this.inputresult,
						result_type:this.choosevalue,
						class_id:this.choosetsvalue,
						handle_type:this.chooseclvalue
					})
					.then(response => {
						if (response.data.msg.code == 0) {
							this.$message({
								message: '保存成功',
								type: 'success'
							});
							this.choosedetail.result = response.data.data
							this.choosedetail.result_type = this.choosevalue
							this.choosedetail.class_id = this.choosetsvalue
							this.choosedetail.handle_type = this.chooseclvalue
						} else {
							this.$message.error(response.data.msg.info);
						}
					})
					this.showresult = true
				}else if(type==3){
					//编辑
					this.showresult = false
					this.inputresult = this.choosedetail.result
					this.choosevalue = this.choosedetail.result_type
					this.choosetsvalue = this.choosedetail.class_id
					this.chooseclvalue = this.choosedetail.handle_type
				}

			},
			//操作金额
			czmoney(type){
				if(type==1){
					//取消
					this.showmoney = true
				}else if(type==2){

					if(this.inputmoney==''){
						this.$message.error('请输入内容');
						return
					}
					//保存
					axios.post('/api/plan-market/admin/complaint/job/compensation/amount',{
						id:this.chooseorderid,
						compensation_amount:this.inputmoney
					})
					.then(response => {
						if (response.data.msg.code == 0) {
							this.$message({
								message: '保存成功',
								type: 'success'
							});
							this.choosedetail.compensation_amount = response.data.data
						} else {
							this.$message.error(response.data.msg.info);
						}
					})
					this.showmoney = true
				}else if(type==3){
					//编辑
					this.showmoney = false
					this.inputmoney = this.choosedetail.compensation_amount
				}

			},
			//文件列表
			getfilelist(id){
				axios.post('/api/plan-market/admin/complaint/job/annex/list',{
						id:id
					})
					.then(response => {
						if (response.data.msg.code == 0) {
							console.log('文件列表')
							console.log(response)
							this.files = response.data.data
						} else {
							this.$message.error(response.data.msg.info);
						}
					})
			},
			//上传文件
			uploadok(file) {
				console.log(file);
				var that = this;
				var formData = new FormData();
				formData.append("file", file.raw);
				formData.append("id", this.chooseorderid);
				axios.post('/api/plan-market/admin/complaint/job/add/annex', formData)
					.then(response => {
					if (response.data.data) {
						//文件列表
						this.getfilelist(this.chooseorderid)
						this.$message({
							message: '上传成功',
							type: 'success'
						});

					} else {
						that.$message.error(response.data.msg.info);
					}
				})
			},
			//超过5个
			overnum(){
				if(this.files.length==5){
					this.$message.error('最多上传5个附件');
				}
			},
			//删除文件
			removetag(tag){
				console.log(this.files.indexOf(tag))
				var removeid = this.files[this.files.indexOf(tag)].id
				axios.post('/api/plan-market/admin/complaint/job/del/annex',{
					id:removeid
				})
				.then(response => {
					if (response.data.msg.code == 0) {
						//文件列表
						this.getfilelist(this.chooseorderid)
						this.$message({
							message: '删除成功',
							type: 'success'
						});

					} else {
						this.$message.error(response.data.msg.info);
					}
				})

			},
			//下载文件
			taglink(tag){
				console.log(this.files.indexOf(tag))
				var url = this.files[this.files.indexOf(tag)].file_url
				var name = this.files[this.files.indexOf(tag)].file_name
				axios.get(url, {responseType: 'blob'}).then((res) => {
					const downloadUrl = window.URL.createObjectURL(new Blob([res.data]));
					const link = document.createElement('a');
					link.href = downloadUrl;
					link.setAttribute('download', name);
					document.body.appendChild(link);
					link.click();
					link.remove();
				});
			},
			//处理完成或关闭
			backlist(type){
				if(!this.showmoney||!this.showresult){
					this.$message.error('请保存或取消当前编辑内容');
					return
				}
				if(type==1){
					//处理完成
					axios.post('/api/plan-market/admin/complaint/job/update/handler',{
						id:this.chooseorderid,
						status:2
					})
					.then(response => {
						if (response.data.msg.code == 0) {
							//返回页面
							this.backpage()
						} else {
							this.$message.error(response.data.msg.info);
						}
					})
				}else if(type==2){
					//关闭
					//返回页面
					this.backpage()
				}else if(type==3){
					//重启投诉
					this.isshowreplace = true
				}
			},
			//确认重启
			surereplace(){
				if(this.replaceres==''){
					this.$message.error('请填写重启原因');
					return
				}
				axios.post('/api/plan-market/admin/complaint/job/restart',{
					id:this.chooseorderid,
					restart_reason:this.replaceres,
					})
					.then(response => {
						if (response.data.msg.code == 0) {
							console.log('确认重启')
							this.$message({
								message: '重启成功',
								type: 'success'
							});
							//返回页面
							this.backpage()
							this.isshowreplace = false

						} else {
							this.$message.error(response.data.msg.info);
						}
					})

			},
			//返回页面
			backpage(){
				if(this.$route.query.tab==1||this.$route.query.tab==2||this.$route.query.tab==3||this.$route.query.tab==4){
					this.$router.push({
						path: '/tousugongdan',
						query:{
							tab:this.$route.query.tab
						}
					})
				}else if(this.$route.query.tab==5){
					this.$router.push({
						path: '/order_question'
					})
				}else if(this.$route.query.tab==6){
					this.$router.push({
						path: '/order_question/orderOther'
					})
				}else if(this.$route.query.tab==7){
					this.$router.push({
						path: '/order_question/old_dingdan'
					})
				}else if(this.$route.query.tab==8){
					this.$router.push({
						path: '/order_question/old_Other'
					})
				}

			},
			send() {
				if(this.sendmsg==''){
					this.$message.error('请输入内容');
				}else{
					var str = this.sendmsg
					str = str.replace(/\n/g,"<br>");

					//发送留言
					axios.post('/api/plan-market/admin/complaint/job/comment',{
						id:this.chooseorderid,
						content:str
					})
					.then(response => {
						if (response.data.msg.code == 0) {
							this.sendmsg=''
							//右侧留言列表
							this.getspeak(this.chooseorderid)
						} else {
							this.$message.error(response.data.msg.info);
						}
					})
				}

				console.log("按住ctrl+enter时触发")
			},
			//查看完整信息
			fullmsg(id){
				axios.post('/api/plan-market/admin/complaint/job/order/info',{
					order_id:id
					})
					.then(response => {
						if (response.data.msg.code == 0) {
							console.log('完整信息')
							this.choosedetail.address = response.data.data[0].address
							this.choosedetail.address_city = response.data.data[0].address_city
							this.choosedetail.address_district = response.data.data[0].address_district
							this.choosedetail.address_mobile = response.data.data[0].address_mobile
							this.choosedetail.address_name = response.data.data[0].address_name
							this.choosedetail.address_province = response.data.data[0].address_province
							this.choosedetail.id_card_name = response.data.data[0].id_card_name
							this.choosedetail.id_card_num = response.data.data[0].id_card_num

						} else {
							this.$message.error(response.data.msg.info);
						}
					})
			},
			//复制功能
			copy: function(t) {
				console.log(t)
				t = t.toString()
				var that = this;
				this.$copyText(t).then(res => {
					that.$message.success("复制成功");
				});
			},
			//复制功能
			copy2: function() {
				// console.log(t)
				if(this.choosedetail.plan_mobile_produced==null||this.choosedetail.plan_mobile_produced==''){
					var schm = '无'
				}else{
					var schm = this.choosedetail.plan_mobile_produced
				}
				if(this.choosedetail.result==null||this.choosedetail.result==''){
					var cljg = '无'
				}else{
					var cljg = this.choosedetail.result
				}



				var t = '生产号码：'+schm+'\n'+'处理结果：'+cljg


				var that = this;


				this.$copyText(t).then(res => {
					that.$message.success("复制成功");
				});
			},
			allcopy: function() {

				var t = '订单ID：'+this.choosedetail.order_id+'\n'+
						'订单来源：'+this.choosedetail.order_source+'\n'+
						'外部订单编号：'+this.choosedetail.source_id+'\n'+
						'商品名称：'+this.choosedetail.product_sku+'\n'+
						'生产号码：'+this.choosedetail.plan_mobile_produced+'\n'+
						'证件姓名：'+this.choosedetail.id_card_name+'\n'+
						'联系电话：'+this.choosedetail.address_mobile+'\n'+
						'用户投诉内容：'+this.choosedetail.content

				var that = this;


				this.$copyText(t).then(res => {
					that.$message.success("复制成功");
				});
			},
			//打开投诉分类
			changetstype(){
				this.tstitle = ''
				this.isshowtstype = true
			},
			//打开处理分类
			changecltype(){
				this.cltitle = ''
				this.isshowcltype = true
			},
			sureaddtype(){
				if(this.tstitle==''){
					this.$message.error('请输入内容');
					return
				}
				axios.post('/api/plan-market/admin/complaint/job/class/add',{
					title:this.tstitle
					})
					.then(response => {
						if (response.data.msg.code == 0) {
							this.$message({
								message: '操作成功',
								type: 'success'
							});
							this.isshowtstype = false
							this.gettslist()
						} else {
							this.$message.error(response.data.msg.info);
						}
					})
			},
			sureaddcltype(){
				if(this.cltitle==''){
					this.$message.error('请输入内容');
					return
				}
				axios.post('/api/plan-market/admin/complaint/job/handle/type/add',{
					name:this.cltitle
					})
					.then(response => {
						if (response.data.msg.code == 0) {
							this.$message({
								message: '操作成功',
								type: 'success'
							});
							this.isshowcltype = false
							this.getcllist()
						} else {
							this.$message.error(response.data.msg.info);
						}
					})
			},
			gettslist(){
				axios.get('/api/plan-market/admin/complaint/job/class/list')
					.then(response => {
						if (response.data.msg.code == 0) {
							console.log('投诉分类')
							console.log(response)
							this.tslist = response.data.data
						} else {
							this.$message.error(response.data.msg.info);
						}
					})
			},
			getcllist(){
				axios.get('/api/plan-market/admin/complaint/job/handle/type/list')
					.then(response => {
						if (response.data.msg.code == 0) {
							console.log('处理分类')
							console.log(response)
							this.chulilist = response.data.data
						} else {
							this.$message.error(response.data.msg.info);
						}
					})
			},
			tstotext(type){
				for(var x = 0;x<this.tslist.length;x++){
					if(this.tslist[x].id==type){
						return this.tslist[x].title
					}
				}
			},
			cltotext(type){
				for(var x = 0;x<this.chulilist.length;x++){
					if(this.chulilist[x].id==type){
						return this.chulilist[x].name
					}
				}
			},
			deltstype(item){
				this.$confirm('是否确认删除?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {

					axios.post('/api/plan-market/admin/complaint/job/class/delete',{
						id:item.id
						})
						.then(response => {
							if (response.data.msg.code == 0) {
								this.$message({
									type: 'success',
									message: '删除成功!'
								});
								this.isshowtstype = false
								this.gettslist()
							}
						})


				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					});
				});
			},
			delcltype(item){
				this.$confirm('是否确认删除?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {

					axios.post('/api/plan-market/admin/complaint/job/handle/type/delete',{
						id:item.id
						})
						.then(response => {
							if (response.data.msg.code == 0) {
								this.$message({
									type: 'success',
									message: '删除成功!'
								});
								this.isshowcltype = false
								this.getcllist()
							}
						})

					
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					});          
				});
			}
		}
	}
</script>

<style scoped>
.t_outbox{
	display: flex;
	/* border: 1px solid red; */
	box-sizing: border-box;
	height: calc(100vh - 180px);
}
.t_order_detail{
	width: 80%;
	border-right: 1px solid #e3e3e3;
	box-sizing: border-box;
	overflow: auto;
	padding-right: 20px;
}
.t_talk_box{
	width: 20%;
}
.t_detail_kj{
	display: flex;
	flex-wrap: wrap;
	color: #5D5D5D;
	margin-top: 30px;
	font-size: 14px;
}
.t_deta_title{
	width: 130px;
	text-align: right;
	color: #333333;
}
.t_deta_con{
	flex: 1;
	color: #5D5D5D;
}
.t_cllc_title{
	padding: 0 20px;
	box-sizing: border-box;
}
.t_lc_box{
	padding: 20px;
	box-sizing: border-box;
	height: calc(100vh - 400px);
	/* border: 1px solid red; */
	overflow: auto;
}
.t_lc_item{
	margin-bottom: 20px;
}
.t_order_box{
	border: 1px solid #eeeeee;
}
.t_order_box_detail{
	display: flex;
	padding: 20px;
	box-sizing: border-box;
	border-bottom: 1px solid #eeeeee;
}
.t_order_box_detail_head{
background-color: #EEF7FF;
justify-content: space-between;

}
.t_detail_right{
	margin-right: 50px;
}
.t_speak_red{
	color: #FF0C0C;
}
.t_order_title_lei{
	color:  #FF0C0C !important;
	border-bottom: 1px solid #FF0C0C;
}
.t_order_title{
	margin-right: 20px;
	font-weight: bold;
	cursor: pointer;
}
.t_bj_box{
	justify-content: space-between;
	flex-wrap: wrap;
	display: flex;
	align-items: center;
}
/deep/.t_cq_form .el-dialog--center .el-dialog__body{
	padding: 25px 25px 0px;
}
/deep/.t_cq_form .el-input__inner{
      background-color: #f7f8fa;
      border: none;

    }
	.t_clbh{
		width: 140px;
		position: absolute;
		right: 30px;
		top: 40px;
	}
	.t_all_ts{

		position: absolute;
		right: 20px;
		top: 10px;
	}
</style>
<style lang="scss" scoped>
	.index {
		.t_table_box{
		    width: 96%;
		    margin-left: auto;
		    margin-right: auto;
		    margin-top: 20px;
		}

		.see {
			color: #409EFF;
			margin: 20px 0;
			cursor: pointer;
		}

		.cpflex {
			display: flex;
			flex-wrap: wrap;

			/deep/ .el-form-item {
				margin-bottom: 0px;
			}
		}

		.kucun {
			/deep/ .el-input {
				width: 200px;
			}

			.list {
				display: flex;
				text-align: center;
				border-bottom: 1px #EAEAEA solid;

				.bor1 {
					border-right: 1px #EAEAEA solid;

					i {
						color: #409EFF;
						font-size: 14px;
						margin-left: 10px;
						cursor: pointer;
					}
				}

				.th {
					background: #F9F9F9;
					line-height: 45px;
					flex: 1;
					font-size: 14px;
					box-sizing: border-box;
				}

				.td {
					line-height: 45px;
					font-size: 14px;
					flex: 1;
					box-sizing: border-box;
					color: #666;
				}

				.td2 {
					flex: 1.5
				}
			}
		}



				.o_ul {
					background: #F9F9F9;
					display: flex;

					.o_li {
						flex-basis: 160px;
						line-height: 45px;
						display: block;
						color: #727272;
						border-top: 3px #F9F9F9 solid;
						font-size: 14px;
						text-align: center;
					}

					.act {
						border-top: 3px #DD2727 solid;
						background: #FFFFFF;
					}
				}

				.title {
					border-bottom: 1px #EAEAEA solid;
					line-height: 45px;
					padding-left: 30px;
					font-size: 16px;
					background: #F9F9F9;
					color: #727272
				}

				.bsm {
					padding: 20px 20px 0 20px;

					/deep/ .el-input {
						width: 220px;
					}
				}

				.row2 {
					color: #FFF;
					margin-top: 20px;

					a {
						color: #FFF;
					}
				}

				.con {
					margin: 20px;
					// border: 1px #EAEAEA solid;

					.list {
						display: flex;
						text-align: center;
						border-bottom: 1px #EAEAEA solid;

						.bor1 {
							border-right: 1px #EAEAEA solid;

							i {
								color: #409EFF;
								font-size: 14px;
								margin-left: 10px;
								cursor: pointer;
							}
						}

						.th {
							background: #F9F9F9;
							line-height: 45px;
							flex: 1;
							font-size: 14px;
							box-sizing: border-box;
						}

						.td {
							line-height: 45px;
							font-size: 14px;
							flex: 1;
							box-sizing: border-box;
							color: #666;
						}

						.td2 {
							flex: 1.5
						}
					}
				}

				.el-pagination {
					text-align: right;
					margin-right: 20px;
					padding-bottom: 50px;
				}

	}
</style>
